<%-- 
    Document   : mainthongkediem
    Created on : Mar 27, 2012, 1:27:08 PM
    Author     : samph
--%>

<%@page import="java.util.ArrayList"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<div id="content">
  <div id="bieudothongke1" onclick="VeBieuDo(1,2); return false;">Thống kê </div>
  <div id="bieudo"><strong> Cột nằm ngang là điểm, côt thẳng đứng là số bài thi bạn đạt được với số điểm tương ứng</strong>
  </br>
      <div><span>You Clicked: </span><span id="info1">Nothing yet</span></div> 
      <div id="chart1" style="height:400px; width: 600px">
      </div>
  </div>
  <%
        ArrayList<Integer> arr = (ArrayList<Integer>)request.getAttribute("arrKetQua");
  %>
  <script>
        $(document).ready(function(){         
	$.jqplot.config.enablePlugins = true;	
        var s1 = [<%= (int)arr.get(0) %>,<%= (int)arr.get(1) %>,<%= (int)arr.get(2) %>,<%= (int)arr.get(3) %>,<%= (int)arr.get(4) %>,<%= (int)arr.get(5) %>,<%= (int)arr.get(6) %>,<%= (int)arr.get(7) %>,<%= (int)arr.get(8) %>,<%= (int)arr.get(9) %>,<%= (int)arr.get(10) %>,<%= (int)arr.get(11) %>,<%= (int)arr.get(12) %>,<%= (int)arr.get(13) %>,<%= (int)arr.get(14) %>,<%= (int)arr.get(15) %>,<%= (int)arr.get(16) %>,<%= (int)arr.get(17) %>,<%= (int)arr.get(18) %>,<%= (int)arr.get(19) %>];
        var ticks = ['0.5','1','1,5','2','2.5','3','3.5','4','4.5','5','5.5','6','6.5','7','7.5','8','8.5','9','9.5','10'];
        plot1 = $.jqplot('chart1', [s1], {
            // Only animate if we're not using excanvas (not in IE 7 or IE 8)..
            animate: !$.jqplot.use_excanvas,
            seriesDefaults:{
                renderer:$.jqplot.BarRenderer,
                pointLabels: { show: true }
            },
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    ticks: ticks
                }
            },
            highlighter: { show: false }
            
        });
         $('#chart1').bind('jqplotDataClick', 
            function (ev, seriesIndex, pointIndex, data) {
                $('#info1').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
            }
        );
    });

    </script>
  <script  type="text/javascript" src="Template/syntaxhighlighter/jquery.jqplot.min.js"></script>
  <script  type="text/javascript" src="Template/syntaxhighlighter/jqplot.barRenderer.min.js"></script>
  <script  type="text/javascript" src="Template/syntaxhighlighter/jqplot.categoryAxisRenderer.min.js"></script>
  <script  type="text/javascript" src="Template/syntaxhighlighter/jqplot.pointLabels.min.js"></script>
    
    <script src="Template/js/showDialog.js"></script>
    <script>
    $(function() {
            $( "#radio" ).buttonset();
    });
    </script>
</div>
